<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>d2CrudPlus.crud | d2-crud-plus</title>
    <meta name="generator" content="VuePress 1.5.2">
    <link rel="icon" href="/d2-crud-plus/icon-only.png">
    <link rel="manifest" href="/d2-crud-plus/manifest.json">
    <link rel="apple-touch-icon" href="/d2-crud-plus/icons/apple-touch-icon-152x152.png">
    <link rel="mask-icon" href="/d2-crud-plus/icons/safari-pinned-tab.svg" color="#3eaf7c">
    <meta name="description" content="d2-crud-plus doc">
    <meta name="theme-color" content="#3eaf7c">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="msapplication-TileImage" content="/icons/msapplication-icon-144x144.png">
    <meta name="msapplication-TileColor" content="#000000">
    <link rel="preload" href="/d2-crud-plus/assets/css/0.styles.d65d8755.css" as="style"><link rel="preload" href="/d2-crud-plus/assets/js/app.23317b68.js" as="script"><link rel="preload" href="/d2-crud-plus/assets/js/2.a029f53c.js" as="script"><link rel="preload" href="/d2-crud-plus/assets/js/55.f26289a9.js" as="script"><link rel="prefetch" href="/d2-crud-plus/assets/js/10.e87cfc00.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/11.c7840f41.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/12.243ebb27.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/13.d3db5e31.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/14.a4a4fbf2.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/15.ad21706e.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/16.256a4eca.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/17.f8a56930.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/18.6d4c6b3a.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/19.d736a134.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/20.34c6e4e7.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/21.c67c9ecc.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/22.662c298e.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/23.57647e9d.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/24.48f16d56.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/25.7f819760.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/26.a0df82a4.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/27.5716e638.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/28.b5c76f72.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/29.52a5a10f.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/3.415f9a8d.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/30.ef4221ac.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/31.36e79014.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/32.6f900348.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/33.41cadd5e.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/34.03d22327.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/35.93a59b15.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/36.eea4c955.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/37.efad22ab.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/38.322f9f32.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/39.4053095f.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/4.cf4fa4dd.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/40.7a03e87d.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/41.1acfd51a.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/42.e07d467f.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/43.bba767af.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/44.908d07b3.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/45.6405f676.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/46.c3c185ab.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/47.d626890d.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/48.44fa0db2.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/49.91cfd1dd.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/5.24b32c2e.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/50.45b4cf89.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/51.0bc91ed0.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/52.715eb4c2.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/53.6bc086e4.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/54.35be0b19.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/56.ad7fb107.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/57.de61df37.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/58.5a3410ae.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/59.44a82d04.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/6.170b7e1d.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/60.59a40b11.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/61.699e0303.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/62.b6e8ae40.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/63.b59d9648.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/7.5bbb4908.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/8.1e0f83bc.js"><link rel="prefetch" href="/d2-crud-plus/assets/js/9.146d4302.js">
    <link rel="stylesheet" href="/d2-crud-plus/assets/css/0.styles.d65d8755.css">
  </head>
  <body>
    <div id="app" data-server-rendered="true"><div class="theme-container"><header class="navbar"><div class="sidebar-button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" viewBox="0 0 448 512" class="icon"><path fill="currentColor" d="M436 124H12c-6.627 0-12-5.373-12-12V80c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12z"></path></svg></div> <a href="/d2-crud-plus/" class="home-link router-link-active"><!----> <span class="site-name">d2-crud-plus</span></a> <div class="links"><div class="search-box"><input aria-label="Search" autocomplete="off" spellcheck="false" value=""> <!----></div> <nav class="nav-links can-hide"><div class="nav-item"><a href="/d2-crud-plus/guide/" class="nav-link router-link-active">
  指南
</a></div><div class="nav-item"><a href="http://qiniu.veryreader.com/D2CrudPlusExample/index.html" target="_blank" rel="noopener noreferrer" class="nav-link external">
  演示
  <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></div> <a href="https://github.com/greper/d2-crud-plus" target="_blank" rel="noopener noreferrer" class="repo-link">
    GitHub
    <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></nav></div></header> <div class="sidebar-mask"></div> <aside class="sidebar"><nav class="nav-links"><div class="nav-item"><a href="/d2-crud-plus/guide/" class="nav-link router-link-active">
  指南
</a></div><div class="nav-item"><a href="http://qiniu.veryreader.com/D2CrudPlusExample/index.html" target="_blank" rel="noopener noreferrer" class="nav-link external">
  演示
  <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></div> <a href="https://github.com/greper/d2-crud-plus" target="_blank" rel="noopener noreferrer" class="repo-link">
    GitHub
    <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></nav>  <ul class="sidebar-links"><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>指南</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/d2-crud-plus/guide/" class="sidebar-link">介绍</a></li><li><a href="/d2-crud-plus/guide/quickstart.html" class="sidebar-link">快速上手</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading open"><span>进阶</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/d2-crud-plus/guide/mixins.html" class="active sidebar-link">d2CrudPlus.crud</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#如何工作" class="sidebar-link">如何工作</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#接口方法" class="sidebar-link">接口方法</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#geteditform" class="sidebar-link">getEditForm()</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#initcolumns" class="sidebar-link">initColumns()</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#computecrudheight" class="sidebar-link">computeCrudHeight()</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#handlepaginationchange-event" class="sidebar-link">handlePaginationChange(event)</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#handlesearch-searchformdata" class="sidebar-link">handleSearch(searchFormData)</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#dorefresh" class="sidebar-link">doRefresh()</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#doload" class="sidebar-link">doLoad()</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#handledialogopen-mode-row" class="sidebar-link">handleDialogOpen ({ mode, row })</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#addrow" class="sidebar-link">addRow()</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#handlerowadd-row-done" class="sidebar-link">handleRowAdd(row, done)</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#handlerowedit-row-done" class="sidebar-link">handleRowEdit(row, done)</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#editbefore-row" class="sidebar-link">editBefore(row)</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#addbefore-row" class="sidebar-link">addBefore(row)</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#handledialogcancel-done" class="sidebar-link">handleDialogCancel(done)</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#handleselectionchange-selection" class="sidebar-link">handleSelectionChange (selection)</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#handlecurrentchange-currentrow-oldcurrentrow" class="sidebar-link">handleCurrentChange(currentRow, oldCurrentRow)</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#handlerowremove-index-row-done" class="sidebar-link">handleRowRemove ({ index, row }, done)</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#addrequest-row" class="sidebar-link">addRequest (row)</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#editrequest-row" class="sidebar-link">editRequest (row)</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#delrequest-row" class="sidebar-link">delRequest (row)</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#pagerequest-page" class="sidebar-link">pageRequest (page)</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#addafter-row" class="sidebar-link">addAfter(row)</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#editafter-row" class="sidebar-link">editAfter(row)</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#delafter-row" class="sidebar-link">delAfter(row)</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#doafterrowchange-row" class="sidebar-link">doAfterRowChange(row)</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#handleformdatachange-key-value" class="sidebar-link">handleFormDataChange({ key, value })</a></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#doformdatachange-key-value" class="sidebar-link">doFormDataChange ({ key, value })</a></li></ul></li><li class="sidebar-sub-header"><a href="/d2-crud-plus/guide/mixins.html#注意事项" class="sidebar-link">注意事项</a></li></ul></li><li><a href="/d2-crud-plus/guide/options.html" class="sidebar-link">crud配置项</a></li><li><a href="/d2-crud-plus/guide/component.html" class="sidebar-link">组件配置</a></li><li><a href="/d2-crud-plus/guide/column-type.html" class="sidebar-link">字段类型</a></li><li><a href="/d2-crud-plus/guide/types.html" class="sidebar-link">字段类型列表</a></li><li><a href="/d2-crud-plus/guide/slot.html" class="sidebar-link">slot自定义</a></li><li><a href="/d2-crud-plus/guide/extends.html" class="sidebar-link">自定义扩展</a></li><li><a href="/d2-crud-plus/guide/dict.html" class="sidebar-link">数据字典</a></li><li><a href="/d2-crud-plus/guide/event.html" class="sidebar-link">事件监听</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>附加功能</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/d2-crud-plus/guide/permission.html" class="sidebar-link">权限管理</a></li><li><a href="/d2-crud-plus/guide/generate.html" class="sidebar-link">代码生成</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>d2p-extends文档</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/d2-crud-plus/guide/extends/area-selector.html" class="sidebar-link">省市区选择组件</a></li><li><a href="/d2-crud-plus/guide/extends/avatar-cropper.html" class="sidebar-link">头像裁剪上传</a></li><li><a href="/d2-crud-plus/guide/extends/file-uploader.html" class="sidebar-link">文件上传组件</a></li><li><a href="/d2-crud-plus/guide/extends/full-editor.html" class="sidebar-link">富文本</a></li><li><a href="/d2-crud-plus/guide/extends/icon-selector.html" class="sidebar-link">icon选择组件</a></li><li><a href="/d2-crud-plus/guide/extends/tree-selector.html" class="sidebar-link">树形选择组件</a></li><li><a href="/d2-crud-plus/guide/extends/uploader.html" class="sidebar-link">文件上传lib</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>组件文档</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/d2-crud-plus/guide/components/cascade-format.html" class="sidebar-link">cascade-format</a></li><li><a href="/d2-crud-plus/guide/components/cascade-select.html" class="sidebar-link">cascade-select</a></li><li><a href="/d2-crud-plus/guide/components/d2p-cropper.html" class="sidebar-link">d2p-cropper</a></li><li><a href="/d2-crud-plus/guide/components/d2p-cropper-uploader.html" class="sidebar-link">d2p-cropper-uploader</a></li><li><a href="/d2-crud-plus/guide/components/d2p-file-uploader.html" class="sidebar-link">d2p-file-uploader</a></li><li><a href="/d2-crud-plus/guide/components/d2p-files-format.html" class="sidebar-link">d2p-files-format</a></li><li><a href="/d2-crud-plus/guide/components/d2p-form-input.html" class="sidebar-link">d2p-form-input</a></li><li><a href="/d2-crud-plus/guide/components/d2p-icon.html" class="sidebar-link">d2p-icon</a></li><li><a href="/d2-crud-plus/guide/components/d2p-icon-select.html" class="sidebar-link">d2p-icon-select</a></li><li><a href="/d2-crud-plus/guide/components/d2p-images-format.html" class="sidebar-link">d2p-images-format</a></li><li><a href="/d2-crud-plus/guide/components/d2p-quill.html" class="sidebar-link">d2p-quill</a></li><li><a href="/d2-crud-plus/guide/components/d2p-row-format.html" class="sidebar-link">d2p-row-format</a></li><li><a href="/d2-crud-plus/guide/components/d2p-tree-selector.html" class="sidebar-link">d2p-tree-selector</a></li><li><a href="/d2-crud-plus/guide/components/d2p-ueditor.html" class="sidebar-link">d2p-ueditor</a></li><li><a href="/d2-crud-plus/guide/components/date-format.html" class="sidebar-link">date-format</a></li><li><a href="/d2-crud-plus/guide/components/dict-checkbox.html" class="sidebar-link">dict-checkbox</a></li><li><a href="/d2-crud-plus/guide/components/dict-radio.html" class="sidebar-link">dict-radio</a></li><li><a href="/d2-crud-plus/guide/components/dict-select.html" class="sidebar-link">dict-select</a></li><li><a href="/d2-crud-plus/guide/components/dict-switch.html" class="sidebar-link">dict-switch</a></li><li><a href="/d2-crud-plus/guide/components/text-area.html" class="sidebar-link">text-area</a></li><li><a href="/d2-crud-plus/guide/components/values-format.html" class="sidebar-link">values-format</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>其他帮助</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/d2-crud-plus/guide/upgrade.html" class="sidebar-link">版本升级</a></li><li><a href="/d2-crud-plus/guide/questions.html" class="sidebar-link">常见问题</a></li><li><a href="/d2-crud-plus/guide/contact.html" class="sidebar-link">联系作者</a></li></ul></section></li><li><section class="sidebar-group collapsable depth-0"><p class="sidebar-heading"><span>ChangeLog</span> <span class="arrow right"></span></p> <!----></section></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h1 id="d2crudplus-crud"><a href="#d2crudplus-crud" class="header-anchor">#</a> d2CrudPlus.crud</h1> <h2 id="如何工作"><a href="#如何工作" class="header-anchor">#</a> 如何工作</h2> <p>d2CrudPlus是通过 crud页面的混入功能开始工作的<br>
混入之后，该crud页面将继承d2CrudPlus.curd的方法</p> <div class="language-html extra-class"><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
...
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
<span class="token keyword">import</span> <span class="token punctuation">{</span> d2CrudPlus <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'d2-crud-plus'</span>
<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
  mixins<span class="token punctuation">:</span> <span class="token punctuation">[</span>d2CrudPlus<span class="token punctuation">.</span>crud<span class="token punctuation">]</span><span class="token punctuation">,</span> <span class="token comment">// 最核心部分，继承d2CrudPlus.crud</span>
<span class="token punctuation">}</span>
</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
</code></pre></div><h2 id="接口方法"><a href="#接口方法" class="header-anchor">#</a> 接口方法</h2> <p>以下为d2CrudPlus.crud中的方法，您可以调用或覆盖其中的方法进行自定义</p> <h3 id="geteditform"><a href="#geteditform" class="header-anchor">#</a> getEditForm()</h3> <p>获取添加和修改表单的formData</p> <h3 id="initcolumns"><a href="#initcolumns" class="header-anchor">#</a> initColumns()</h3> <p>crudOptions的初始化方法，会在create方法中被调用<br>
此方法调用后将生成d2-crud所需要的全部配置</p> <h3 id="computecrudheight"><a href="#computecrudheight" class="header-anchor">#</a> computeCrudHeight()</h3> <p>计算表格的最大高度，在mounted中给表格设置maxHeight，使翻页组件能保持在窗口可见的最底部</p> <h3 id="handlepaginationchange-event"><a href="#handlepaginationchange-event" class="header-anchor">#</a> handlePaginationChange(event)</h3> <p>翻页组件change事件触发方法</p> <h3 id="handlesearch-searchformdata"><a href="#handlesearch-searchformdata" class="header-anchor">#</a> handleSearch(searchFormData)</h3> <p>查询按钮点击事件触发方法</p> <h3 id="dorefresh"><a href="#dorefresh" class="header-anchor">#</a> doRefresh()</h3> <p>表格刷新数据</p> <h3 id="doload"><a href="#doload" class="header-anchor">#</a> doLoad()</h3> <p>页面打开后触发，第一次拉取数据</p> <h3 id="handledialogopen-mode-row"><a href="#handledialogopen-mode-row" class="header-anchor">#</a> handleDialogOpen ({ mode, row })</h3> <p>【空方法，可直接覆盖】对话框被打开前调用，用于在打开对话前修改传入表单的数据</p> <h3 id="addrow"><a href="#addrow" class="header-anchor">#</a> addRow()</h3> <p>此方法将触发打开添加对话框</p> <h3 id="handlerowadd-row-done"><a href="#handlerowadd-row-done" class="header-anchor">#</a> handleRowAdd(row, done)</h3> <p>添加对话框点击提交的处理</p> <h3 id="handlerowedit-row-done"><a href="#handlerowedit-row-done" class="header-anchor">#</a> handleRowEdit(row, done)</h3> <p>编辑对话框点击提交的处理</p> <h3 id="editbefore-row"><a href="#editbefore-row" class="header-anchor">#</a> editBefore(row)</h3> <p>编辑对话框提交到后端前对表单数据进行处理<br>
默认会调用<code>this.doValueResolve(row)</code>，内部会遍历column配置的<code>valueResolve(row,key)</code><br>
如要覆盖此方法，不要忘记调用<code>this.doValueResolve(row)</code></p> <h3 id="addbefore-row"><a href="#addbefore-row" class="header-anchor">#</a> addBefore(row)</h3> <p>添加对话框提交到后端前对表单数据进行处理<br>
默认会调用<code>this.doValueResolve(row)</code> ，内部会遍历column配置的<code>valueResolve(row,key)</code><br>
如要覆盖此方法，不要忘记调用<code>this.doValueResolve(row)</code></p> <h3 id="handledialogcancel-done"><a href="#handledialogcancel-done" class="header-anchor">#</a> handleDialogCancel(done)</h3> <p>编辑对话框取消的处理</p> <h3 id="handleselectionchange-selection"><a href="#handleselectionchange-selection" class="header-anchor">#</a> handleSelectionChange (selection)</h3> <p>【空方法，可直接覆盖】多选事件</p> <h3 id="handlecurrentchange-currentrow-oldcurrentrow"><a href="#handlecurrentchange-currentrow-oldcurrentrow" class="header-anchor">#</a> handleCurrentChange(currentRow, oldCurrentRow)</h3> <p>【空方法，可直接覆盖】单选事件</p> <h3 id="handlerowremove-index-row-done"><a href="#handlerowremove-index-row-done" class="header-anchor">#</a> handleRowRemove ({ index, row }, done)</h3> <p>删除按钮提交时的处理方法</p> <h3 id="addrequest-row"><a href="#addrequest-row" class="header-anchor">#</a> addRequest (row)</h3> <p>添加记录的http请求方法，返回Promise，请参考示例自行实现该方法</p> <h3 id="editrequest-row"><a href="#editrequest-row" class="header-anchor">#</a> editRequest (row)</h3> <p>修改记录的http请求方法，返回Promise，请参考示例自行实现该方法</p> <h3 id="delrequest-row"><a href="#delrequest-row" class="header-anchor">#</a> delRequest (row)</h3> <p>删除记录的http请求方法，返回Promise，请参考示例自行实现该方法</p> <h3 id="pagerequest-page"><a href="#pagerequest-page" class="header-anchor">#</a> pageRequest (page)</h3> <p>查询页面数据的http请求方法，返回Promise，请参考示例自行实现该方法</p> <h3 id="addafter-row"><a href="#addafter-row" class="header-anchor">#</a> addAfter(row)</h3> <p>添加http请求成功后触发，默认会调用<code>this.doAfterRowChange(row)</code>刷新表格数据</p> <h3 id="editafter-row"><a href="#editafter-row" class="header-anchor">#</a> editAfter(row)</h3> <p>修改http请求成功后触发，默认会调用<code>this.doAfterRowChange(row)</code>刷新表格数据</p> <h3 id="delafter-row"><a href="#delafter-row" class="header-anchor">#</a> delAfter(row)</h3> <p>删除http请求成功后触发，默认会调用<code>this.doAfterRowChange(row)</code>刷新表格数据</p> <h3 id="doafterrowchange-row"><a href="#doafterrowchange-row" class="header-anchor">#</a> doAfterRowChange(row)</h3> <p>表格行数据变动后触发，默认会调用<code>this.doRefresh()</code>刷新表格数据</p> <h3 id="handleformdatachange-key-value"><a href="#handleformdatachange-key-value" class="header-anchor">#</a> handleFormDataChange({ key, value })</h3> <p>编辑框表单改变事件<br>
默认会执行相应的<code>column.form.valueChange</code><br>
然后调用<code>this.doFormDataChange({ key, value })</code></p> <h3 id="doformdatachange-key-value"><a href="#doformdatachange-key-value" class="header-anchor">#</a> doFormDataChange ({ key, value })</h3> <p>【空方法，可直接覆盖】用户自定义的表单改变事件处理</p> <h2 id="注意事项"><a href="#注意事项" class="header-anchor">#</a> 注意事项</h2> <div class="custom-block warning"><p class="custom-block-title">WARNING</p> <p>请不要修改page.vue中ref的值</p></div></div> <footer class="page-edit"><div class="edit-link"><a href="https://github.com/greper/d2-crud-plus/edit/master//docs/guide/mixins.md" target="_blank" rel="noopener noreferrer">在 GitHub 上编辑此页</a> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></div> <div class="last-updated"><span class="prefix">上次更新:</span> <span class="time">2020-1-8 18:29:03</span></div></footer> <div class="page-nav"><p class="inner"><span class="prev">
      ←
      <a href="/d2-crud-plus/guide/quickstart.html" class="prev">
        快速上手
      </a></span> <span class="next"><a href="/d2-crud-plus/guide/options.html">
        crud配置项
      </a>
      →
    </span></p></div> </main></div><div class="global-ui"></div></div>
    <script src="/d2-crud-plus/assets/js/app.23317b68.js" defer></script><script src="/d2-crud-plus/assets/js/2.a029f53c.js" defer></script><script src="/d2-crud-plus/assets/js/55.f26289a9.js" defer></script>
  </body>
</html>
